<template>
<div>
  <van-nav-bar
      title="物流页面"
      left-text="返回"
      right-text="按钮"
      left-arrow
      @click-left="onClickLeft"
      @click-right="onClickRight"
  />
  <van-pull-refresh v-model="isLoading" @refresh="onRefresh" style="min-height: 100vh;" >
    <p style="margin-left: 150px">拉住我刷新</p>
    <van-steps direction="vertical" :active="0">
      <van-step>
        <h6>【城市】物流状态1</h6>
        <p>2016-07-12 12:40</p>
      </van-step>
      <van-step>
        <h6>【城市】物流状态2</h6>
        <p>2016-07-11 10:00</p>
      </van-step>
      <van-step>
        <h6>快件已发货</h6>
        <p>2016-07-10 09:30</p>
      </van-step>
    </van-steps>
  </van-pull-refresh>
</div>
</template>

<script>
import { Toast } from 'vant';

export default {
  name: "logistics",
  data() {
    return {
      isLoading: false,
    };
  },
  methods: {
    onClickLeft() {
      Toast('返回');
    },
    onClickRight() {
      Toast('按钮');
    },
    onRefresh() {
      setTimeout(() => {
        Toast('刷新成功');
        this.isLoading = false;
        this.count++;
      }, 1000);
    },
  },
}
</script>

<style>

</style>